<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>新闻列表页</title>
	<link rel="stylesheet" href="css/index.css">
	<link rel="stylesheet" href="css/paging.css">
	<script type="text/javascript" src='js/jquery-1.11.2.js'></script>
	<script type="text/javascript" src='js/paging.js'></script>
</head>
<body>
	<!-- 导航开始 -->
	<nav class="navbar">
		<div class="container navbar-content">
			<a href="01-新闻列表页.html">首页</a>
			<a href="03-新闻添加页.html">添加新闻</a>
		</div>
	</nav>
	<!-- 导航结束 -->
	
	<!-- 图片 -->
	<img src="images/bg.jpg" class="index-bg">

	<!-- 具体内容 -->
	<div class="container">
		<h1>新闻系统</h1>
		<!-- 新闻列表开始 -->
	    <div class="news-list">
	        <!-- 新闻列表左边开始 -->
	        <div class="news-list-left">
	        	<!-- 列表项开始 -->
	        	<?php foreach($news as $n):?>
	            <div class="news-list-item">
	            	<!-- 作者以及发布时间 -->
	                <div class="author-time"> <span><?php echo $n['name'];?></span> 发表于 <span><?php echo date('Y-m-d h:i:s');?></span> </div>
					<!-- 新闻详情 -->
	                <div class="news-des">
	                	<!-- 新闻标题 -->
	                    <h3 class="news-title" style='float: left;'>
	                    	<i></i><a href="detail.php?id=<?php echo $n['id']?>"><?php echo $n['title'];?></a>
	                    </h3>

	                    <!-- 编辑,删除 -->
	                    <div class="operate">
	                    	<a href="04-新闻修改页.html">编辑</a>&nbsp;&nbsp;<a href="delete.php?id=<?php echo $n['id']?>" onclick="return confirm('你确认要删除本条新闻:<?php echo $n['title']?>吗?')">删除</a>
	                    </div>

	                    <div style='clear:both'></div>

	                    <!-- 新闻内容 -->
	                    <div class="news-content-des ellipsis"><?php echo $n['content'];?></div>
	                </div>
	            </div>
	             <?php endforeach;?>
	        	<!-- 列表项结束 -->
	        	
	        	
	        </div>
	        <!-- 新闻列表左边结束 -->
			
	        <!-- 新闻列表右边-关于我们开始 -->
	        <div class="news-list-right">
	            <div class="about">
	                 <h4>关于我们</h4> 
	                <div class="about-des">
	                    <p>关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们关于我们</p>
	                </div>
	            </div>
	        </div>
	        <!-- 新闻列表右边-关于我们结束 -->
			
			<div style='clear:both;'></div>

			<!-- 分页 -->
			<div id="pageTool"></div>
			<script type="text/javascript">
				  //jquery插件的写法
			        $('#pageTool').Paging({ 
			        	count: 50,
			        	pagesize:10,
			        	hash: true,
			        });
			       	/* http://www.lovewebgames.com/jsmodule/paging.html
					属性和方法
					 pagesize:	每页的条数,默认10条
					 count为总记录数

					 hash:false	是否用url hash值的形式来表达分页，默认为true,但如果出现两个分页时，为导致互相影响，应保证只有一个对应hash

					 callback:function(page,size,count)	翻页时的回调方法，page为当前页码,size为每页条数，count为总页数

					 current:	当前页码，默认为1
					 prevTpl	上一页的模板,默认“上一页”
					 nextTpl	下一页的模板，默认“下一页”
					 firstTpl	首页的模板，默认“首页”
					 lastTpl	末页的模板，默认“末页”
					 ellipseTpl	省略号的模板，默认“...”
					 toolbar: bool	是否显示工具栏,默认为false
					 pageSizeList:[]	当显示工具栏时有效，可设置每页条数，默认为[5,10,15,20]
					 changePagesize:function(ps)	修改每页的条数,参数为int
					 go:function(p)	跳转至某一页,默认到current
					 render:function(ops)	重新渲染,ops:{count:int,pagesize:int,current:int,pagecount:int}
			       	*/
			</script>

			<!-- 底部开始 -->
	        <footer class="copyright">Copyright 2019 Mr.Xu All rights reserved.</footer>
			<!-- 底部结束 -->
	    </div>
		<!-- 新闻列表结束 -->
	</div>
</body>
</html>